#mask {
    display:block;
    width:100%;
    height:100%;
    background:#000;
    z-index: 999999;
    position:fixed;
    top:0;
    left:0;
}
.afPopup {
    display: block;
    width: 280px;
    float:left;
    border: solid 1px #72767b;
    border-radius:10px;
    padding: 10px;
    opacity: 1;
    -webkit-transform: scale(1);
    transform:scale(1);    
    position: absolute;
    z-index: 1000000;
    top: 50%;
    left: 50%;
    margin: 0px auto;
    background: rgba(70,70,70,1);
    color:white;
    & > * {
        color:inherit;
    }
    & > HEADER {
        font-weight:bold;
        font-size:20px;
        margin:0;
        padding:5px;
    }
    & > DIV {
        font-size:14px;
        margin:8px;
    }
    & > FOOTER {
        width:100%;
        text-align:center;
        display:block !important;
        & > A#cancel {
            float:left;
        }
        & > A#action {
            float:right;
        }
        & > A.center {
            float:none!important;
            width:80%;
            margin:8px;
        }
    }
}
.afPopup.hidden {
    opacity: 0;
    -webkit-transform: scale(0.1);
    
}

.afPopup.show {
    -webkit-transition: all  0.20s  ease-in-out; 
    transition: all 0.20s  ease-in-out;
}
